import React, { Component } from 'react';
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import { Grid, WingBlank, WhiteSpace } from 'antd-mobile';
import { hashHistory } from 'react-router';
import RecommendItem from 'common/components/recommendItem.js';
import * as userInfoActions from 'common/userinfo.js';
import './bookShelf.less';

class BookShelf extends Component{

	gotoDetail = () => {
		// hashHistory.push("/bookDetail");
	}

	constructor(props) {
	    super(props);
	    this.state = {
			data: [
				{
					icon: 'assets/img/book.jpg',
					text: '分类'
				},
				{
					icon: 'assets/img/book.jpg',
					text: '排行榜'
				},
				{
					icon: 'assets/img/book.jpg',
					text: '特价'
				},
				{
					icon: 'assets/img/book.jpg',
					text: '特价'
				},
				{
					icon: 'assets/img/book.jpg',
					text: '特价'
				},
				{
					icon: 'assets/img/book.jpg',
					text: '特价'
				}
			]
	    }
	}

	componentWillUnmount(){
		this.props.userInfoActions.update({
			prevRouteUrl: 'bookShelf'
		})
	}

	render(){
		return(
			<div className="bookShelf">
				<WingBlank>
					<Grid activeStyle={false} columnNum={3} hasLine={false} data={this.state.data}
						onClick={(el, index) => this.gotoDetail(el, index)}/>
		      	</WingBlank>
			</div>
		)
	}
}

function mapStateToProps(state){
	return {
		userinfo: state.userinfo
	}
}

function mapDispatchToProps(dispatch){
	return {
		userInfoActions: bindActionCreators(userInfoActions, dispatch)
	}
}

export default connect(
	mapStateToProps,
	mapDispatchToProps
)(BookShelf);